<template>
  <MessageBox2 :page-size="pageSize" :current-page="currentPage" :total="total" :table-data="contractStore.contracts"
               :table-title-list="tableTitleList" :loading="loading" :table-title="tableTitle" :batch-mode="batchMode"
               @current-change="currentPageChange" @size-change="pageSizeChange"
               @selectionChange="updateSelectedRows">


    <template v-slot:table-btn>
      <!-- 显示合同状态的数字转换为文字 -->
      <el-table-column label="合同状态">
        <template #default="{row}">
          {{ getContractStatusText(row.contractStatus) }}
        </template>
      </el-table-column>
      <!--      <el-table-column label="操作" width="200" show-overflow-tooltip>-->
      <!--      </el-table-column>-->
    </template>
  </MessageBox2>
</template>

<script setup>
import {ref} from 'vue'
import MessageBox2 from "@/components/MessageBox2.vue";
import {ElMessageBox} from "element-plus";
import {getContractByEmpIdService} from "@/api/contract.js";
import {contractsStore} from "@/stores/modules/contracts.js";
import {userLoginStore} from "@/stores/modules/userLogin.js";

const contractStore = contractsStore()
const userLogin = userLoginStore()
// 表格参数
const tableTitle = "合同信息"
const tableTitleList = {
  contractId: "合同编号",
  cusId: "客户编号",
  cusName: "客户名称",
  contractDate: "合同签订日期",
  contractEndDate: "合同结束日期",
  remark: "合同备注"
}
const loading = ref(false)
const total = ref(0)
const currentPage = ref(1)
const pageSize = ref(10)


const getContractStatusText = (status) => {
  const statusMap = {
    1: '未履行',
    2: '已完成',
    3: '已取消',
    4: '履行中'
  };
  return statusMap[status] || '未知状态'; // 如果没有匹配的状态，返回 '未知状态'
}

//页面变化 + 条件变化
const getContractPage = async (currentPage, pageSize, empId) => {
  loading.value = true

  console.log(currentPage, pageSize, empId)
  try {
    const res = await getContractByEmpIdService(currentPage.value, pageSize.value, empId)
    console.log(res)
    if (res.status === 200) {
      contractStore.setContracts(res.data.data.records)
      total.value = res.data.data.total
    }
  } catch (e) {
    await ElMessageBox.alert('请求出错')
    console.log(e)
  } finally {
    loading.value = false
  }
}

//子组件触发
const currentPageChange = (cP) => {
  currentPage.value = cP
  getContractPage(currentPage, pageSize, userLogin.id)
}
const pageSizeChange = (size) => {
  pageSize.value = size
  getContractPage(currentPage, pageSize, userLogin.id)
}

// 批量删除客户
// 状态控制
const batchMode = ref(false); // 是否启用批量模式
const selectedRows = ref([]); // 存储选中的行数据
// 切换批量操作模式
const toggleBatchMode = () => {
  batchMode.value = !batchMode.value;
  if (!batchMode.value) {
    selectedRows.value = []; // 清空选中数据
  }
};
// 更新选中的行数据
const updateSelectedRows = (rows) => {
  selectedRows.value = rows;
};

// 初始化
console.log("初始化")
getContractPage(currentPage, pageSize, userLogin.id)
console.log("初始化结束")

</script>

<style scoped>

</style>